<!--代码逻辑和样式库-->
<script src="./detail-user.component.js"></script>
<style src="./detail-user.scss" scoped lang="scss"></style>

<template>
  <div>
    <el-dialog :visible.sync="showDialog" width="1300px" @close="closeDialog()">
      <span slot="title">
        <span class="aq-text-weight-bolder">用户信息管理</span>
        <i class="aq-margin-left-12 aq-margin-right-12 el-icon-arrow-right"></i>
        {{ title }}
      </span>
      <el-form ref="dataForm" :model="editForm" label-position="top" label-width="120px">
        <el-row class="aq-padding-left-32 aq-padding-right-32" :gutter="20" type="flex">
          <el-col :span="5">
            <el-form-item>
              <div>用户编号</div>
              <el-input v-model="editForm.userName" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item>
              <div>用户名称</div>
              <el-input v-model="editForm.trueName" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item>
              <div>手机号码</div>
              <el-input v-model="editForm.mobileNumber" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item>
              <div>用户职位</div>
              <el-input v-model="editForm.roleNames" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="4" class="aq-vertical-middle">
            <div class="aq-vertical-middle">
              帐号状态
              <el-switch class="aq-margin-left-16" v-model="editForm.isEnable" :active-value="1" :inactive-value="0" active-color="#13ce66" inactive-color="#ff4949" disabled>
              </el-switch>
            </div>
          </el-col>
        </el-row>
        <el-row class="aq-padding-left-32 aq-padding-right-32" :gutter="20" type="flex">
          <el-col :span="5" class="aq-vertical-middle">
            <div class="aq-vertical-middle">
              用户性别
              <el-radio class="aq-margin-left-16" v-model="editForm.sex" label="男" disabled>男</el-radio>
              <el-radio v-model="editForm.sex" label="女" disabled>女</el-radio>
            </div>
          </el-col>
          <el-col :span="9">
            <el-form-item>
              <div>所属组织</div>
              <el-input v-model="editForm.structName" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="1" class="aq-vertical-middle">——</el-col>
          <el-col :span="5">
            <el-form-item>
              <div>部门编码</div>
              <el-input v-model="editForm.structCode" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item>
              <div>用户状态</div>
              <el-input v-model="editForm.status" disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <div class="band"></div>
        <el-row class="aq-padding-top-16 aq-padding-left-32 aq-padding-right-32">
          <el-col :span="10">
            <el-form-item>
              <div>用户备注</div>
              <el-input v-model="editForm.remark" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item>
              <div>用户头像</div>
              <img v-if="editForm.headImgUrl" :src="file_url + editForm.headImgUrl" class="avatar">
              <div v-if="!editForm.headImgUrl" class="no-avatar text-center">
                <i class="el-icon-picture-outline aq-margin-top-20 aq-text-size-large"></i>
                <div class="aq-text-size-small">暂无照片</div>
              </div>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </el-dialog>
  </div>
</template>
